# Browser wallet

To connect to a wallet in a web3-enabled browser, use ``activateBrowserWallet`` returned by ``useEthers()``.
Once connected ``account`` variable will be available.

See example below:

```tsx
  export function App() {
    const { activateBrowserWallet, account } = useEthers()
    return (
      <div>
        {!account && <button onClick={activateBrowserWallet}> Connect </button>}
        {account && <p>Account: {account}</p>}
      </div>
    )
  }
```

## useEthers

``useEthers`` hook returns a number of useful functions and variables, see below:

- ``account`` - current user account (or ``null`` if not connected or connected in read-only mode)

- ``chainId`` - current chainId (or ``undefined`` if not connected)

- ``library`` - an instance of ethers [Web3Provider](https://docs.ethers.io/v5/api/providers/other/#Web3Provider) (or ``undefined`` if not connected). Read more about ethers providers [here](https://docs.ethers.io/v5/api/providers/).

- ``active`` - boolean that indicates if provider is connected (read or write mode)

- ``activate`` - function that allows to connect to a wallet. This is a [web3-react](https://github.com/NoahZinsmeister/web3-react) function that can take various connectors.

- ``deactivate`` - function that disconnects wallet

- ``error`` - an error that occurred during connecting (e.g. connection is broken, unsupported network)

- ``switchNetwork`` - a function which, given a chainId, will ask the browser wallet to switch the network, and if the network hasn't been added yet, will make an attempt to add the network to the wallet. Only compatible with Metamask.

## Example

Example below demonstrates how to manage and use connection.

Application allow to see the balance of Ethereum 2.0 staking contracts in read-only mode.
When wallet is connected additionally it shows user's account along with it's balance.

import { ExampleContainer } from '/src/examples/ExampleContainer';
import ConnectingToNetwork from '../../../example-loader.js!/src/examples/ConnectingToNetwork.tsx'

<ExampleContainer example={ConnectingToNetwork}/>
